<script setup lang="ts">
import type { IndicatorSubmitInfoResult } from '@/types'

const props = defineProps<{
  unit: string
  loading: boolean
}>()
const data = defineModel<
  IndicatorSubmitInfoResult['dataList']
>({ required: true })

const valueLabel = computed(() => {
  return `数量${
    props.unit ? `（${props.unit}）` : ''
  }`
})
</script>

<template>
  <ElTable
    v-loading="loading"
    element-loading-custom-class="global-loading"
    :data="data"
    border
    height="100%"
    style="height: 100%"
  >
    <template #empty>
      <TableEmpty />
    </template>
    <ElTableColumn
      label="时间"
      prop="dataTime"
      :width="200"
    />
    <ElTableColumn :label="valueLabel" prop="value">
      <template #default="{ $index }">
        <ElInputNumber
          v-model="data[$index as number]!.val"
          placeholder="请输入"
          :min="0"
          :precision="2"
          :value-on-clear="null"
          style="width: 80%"
        />
      </template>
    </ElTableColumn>
  </ElTable>
</template>

<style scoped>
:deep(.el-input-number .el-input) {
  /* width: auto!important; */
  width: 100% !important;
}
</style>
